<template>
    <rx-layout>

        <template #middle>
            <div style="padding: 10px;width: 100%;height: 100%">
                <rx-fit v-model="fitSearch">
                    <template #head>
                        <div style="display: flex;align-items: center;justify-content: space-between;">
                            <div class="table-operator">
                                {{ i18n('list.myPending','我的挂起') }}
                            </div>
                            <span class="search-btn" @click.stop="searchshow" @mousedown.stop><SearchOutlined/>{{ $ti18('rxList.leachBtn', '过滤') }}</span>
                        </div>
                    </template>
                    <template #search>
                        <a-form layout="vertical">
                            <a-form-item :label="i18n('list.taskName','任务名称')">
                                <a-input :placeholder="i18n('msa.taskNameMsa','请输入任务名称')"
                                         v-model:value="urlConfig.queryParam['Q_TASK_NAME__S_LK']"/>
                            </a-form-item>
                            <a-form-item :label="i18n('list.billNo','单据编号')">
                                <a-input :placeholder="i18n('msa.billNo','请输入业务单号')"
                                         v-model:value="urlConfig.queryParam['Q_BILL_NO__S_EQ']"/>
                            </a-form-item>
                        </a-form>
                        <div class="list-search-toolbar">
                            <a-button type="primary" @click="search">
                                <SearchOutlined/>
                                {{ $ti18('rxList.searchBtn', '查询') }}
                            </a-button>
                            <a-button style="margin-left: 4px" @click="resetSearch">
                                <RedoOutlined />
                                {{ $ti18('rxList.resetBtn', '重置') }}
                            </a-button>
                        </div>
                    </template>
                    <template #middle>
                        <rx-grid ref="table"
                                 :hasPage="true"
                                 :urlConfig="urlConfig"
                                 :selectConfig="selectConfig"
                                 url="/api-bpm/bpm/core/bpmPendingRecord/query"
                                 field="taskId"
                                 :columns="columns"
                        >
                            <template #action="{ row }">
                                <RxGridAction :size="2">
                                    <span  v-if="!row.endTime" @click="handleTask(row)">{{i18n('list.handle','办理')}}</span>
                                    <span v-else @click.stop="onDetail(row)">{{$ti18('rxList.detailBtn','明细')}}</span>
                                </RxGridAction>
                            </template>
                        </rx-grid>
                    </template>
                </rx-fit>
            </div>
        </template>
    </rx-layout>
</template>

<script>
import {RxLayout, RxLangInput, RxFit,BaseList,Util} from '@lowcode/jpaas-base-lib';
import FlowUtil from "@/views/modules/bpm/js/FlowUtil.js"
import { App } from '@lowcode/jpaas-share-component';
import TaskBatApprove from "@/views/modules/bpm/ws/TaskBatApprove.vue";
import userUser from "@/stores/userUser";
import { mapState } from 'pinia';
import locale from 'ant-design-vue/es/date-picker/locale/zh_CN';
import instAndTaskShare from "@/views/modules/column/processOverview/instAndTaskShare.js";
import  rxCategoryTreeeditor from "@/views/modules/column/processOverview/rx-category-treeeditor.vue"


export default {
    name: "MyBpmPending",
    components: {RxLayout, RxFit, RxLangInput,rxCategoryTreeeditor},
    mixins: [BaseList,App,FlowUtil,instAndTaskShare],
    computed:{
        ...mapState(userUser, ['user'])
    },
    data() {
        return {
            locale,
            urlConfig: {
                ajaxType: 'post',
                contentType: 'json',
                queryParam: {},
                dataField: 'result.data',
                totalField: 'result.totalCount'
            },
            selectConfig: {
                type: 'checkbox'
            },
            columns: [
                {
                    title: this.i18n('list.taskName','任务名称'),
                    field: 'taskName',
                    minWidth: 240,
                },
                {
                    title: this.i18n('list.billNo', '单据编号'),
                    field: 'billNo',
                    minWidth: 120,
                },
                {
                    title: this.i18n('list.nodeName','挂起环节'),
                    field: 'nodeName',
                    minWidth: 120,
                },
                {
                    title:this.i18n('list.startTime','开始时间'),
                    field: 'startTime',
                    minWidth: 100,
                },
                {
                    title:this.i18n('list.endTime','结束时间'),
                    field: 'endTime',
                    minWidth: 100,
                },
                {
                    title: this.$ti18('rxList.action', '操作'),
                    field: 'action',
                    minWidth: 40,
                    allowCellEdit: false,
                    slots: {default: 'action'},
                },
            ],
            treeRootList:[],
            isBpmClient:false,
            isMyBpm:true,
        }
    },
    created() {
        this.urlConfig.queryParam = {};
        this.urlConfig.queryParam["Q_CREATE_BY__S_EQ"]=this.user.userId;
        let appId=this.curApp.appId;
        if(appId){
            this.urlConfig.queryParam.Q_APP_ID__S_EQ=appId;
        }
    },
    methods: {
        i18n(name,text,key){
            return this.$ti18(name,text,"MyPending",key);
        },
        handleTask(record) {
            this.openInst(record.appId,record.instId,record.taskId);
        },
        resetSearch() {
            this.urlConfig.queryParam = {};
            this.urlConfig.queryParam["Q_CREATE_BY__S_EQ"]=this.user.userId;
            let appId=this.curApp.appId;
            if(appId){
                this.urlConfig.queryParam.Q_APP_ID__S_EQ=appId;
            }
            this.$nextTick(() => {
                this.$refs['table'].loadData();
            })
        },
        getPopupContainer(p){
            return p.parentNode ;
        },
        onDetail(record) {
            this.openDetail(record.appId,record.instId,"");
        },
    },
    watch: {},
}
</script>

<style scoped>

</style>
